<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../layui-v2.7.6/layui/css/layui.css">
</head>
<body>

<div class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">手机</label>
    <div class="layui-input-block">
      <input type="tel" name="phone" lay-verify="required|phone" class="layui-input demo-phone">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">验证码</label>
    <div class="layui-input-inline">
      <input type="text" name="vercode" lay-verify="required" class="layui-input">
    </div>
    <div class="layui-inline">
      <button type="button" class="layui-btn layui-btn-primary" lay-on="get-vercode">获取验证码</button>
    </div>
  </div>
</div>

<script type="text/javascript" src="../layui-v2.7.6/layui/layui.js"></script>
<script>
  layui.use(['form', 'util'], function(){
    var form = layui.form;
    var layer = layui.layer;
    var util = layui.util;

    // 自定义普通事件
    util.on('lay-on', {
      "get-vercode": function(othis){
        var isValid = form.validate('.demo-phone');  // 注：v2.7.0 新增

        // 验证通过
        if(isValid){
          layer.msg('手机号验证通过，执行发送验证码的操作');
        }
      }
    });
  });
</script>
</body>
</html>